<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>语法测试</title>
    <style>
        pre{
            border: black solid 1px;
        }
    </style>
</head>
<body>
<br/>
<br/>
<br/>
<h1>(1).测试:显示普通的文本信息</h1>
<hr/>
<h3>
    <pre>
        [后台]：
        model.addAttribute("msg","获得msg信息");
        [前端]：
        &lt;h3 th:text="${msg}">&lt;/h3>
    </pre>
</h3>

<h3 th:text="${msg}"></h3>

<br/>
<br/>
<br/>




<h1>(2).测试:显示html标签</h1>
<hr/>
<h3>
    <pre>
        [后台]：
        model.addAttribute("tag","&lt;h4>我是h4标签&lt;/h4>");
        [前端]：
        &lt;h3 th:text="${tag}">&lt;/h3>
        &lt;h3 th:utext="${tag}">&lt;/h3>
    </pre>
</h3>
<h3 th:text="${tag}"></h3>
<h3 th:utext="${tag}"></h3>

<br/>
<br/>
<br/>


<h1>(3).测试:遍历语法</h1>
<hr/>
<h3>
    <pre>
        [后台]：
        String names[] = {"张三","李四","王五"};
        model.addAttribute("names", Arrays.asList(names));
        [前端]：
        &lt;ul>
            &lt;li th:each="name:${names}" th:text="${name}">&lt;/li>
        &lt;/ul>
    </pre>
</h3>
<h3>
    <ul>
        <li th:each="name:${names}" th:text="${name}"></li>
    </ul>
</h3>

<br/>
<br/>
<br/>





<h1>(4).测试:访问图片资源</h1>
<hr/>
<h3>
    <pre>
        [后台]：
        无
        [前端]：
        &lt;img th:src="@{/img/img01.png}" style="width: 130px;height: 100px;"/>
    </pre>
</h3>
<img th:src="@{/img/img01.png}" style="width: 130px;height: 100px;"/>

<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
</body>
</html>
